今日Tutting作品分享~
WINNER | FLEX SOLO DANCE CHAMPIONSHIP | HITTESH PATEL
昨天我們完成了虛擬舞者的骨架資料結構,今天要讓這套資料「組裝起來」,使用 Canvas API 把它畫在畫布上,並依據關節關係表確保每個關節關係連接。
| 關節名稱 | 連結關節 |
|---|---|
| Head | Neck |
| Neck | center |
| center | Waist |
| Waist | Hip |
| Hip | |
| leftShoulder | center |
| rightShoulder | center |
| leftElbow | leftShoulder |
| leftWrist | leftElbow |
| leftPalm | leftWrist |
| rightElbow | rightShoulder |
| rightWrist | rightElbow |
| rightPalm | rightWrist |
| leftknee | Hip |
| leftAnkle | leftknee |
| leftToe | leftAnkle |
| rightknee | Hip |
| rightAnkle | rightknee |
| rightToe | rightAnkle |
Canvas 渲染火柴人骨架結果:
完成骨架資料 → Canvas 繪圖流程,成功畫出 2D 火柴人虛擬舞者,
為了讓 Tutting 模擬器 更加貼近使用者,接下來會探討並實作 Tutting 的舞蹈規則,
明天見~~~![]()